import React, { Component } from 'react'
import "./Goods.less"

const nav = [
    { id: 1, title: "猜你喜欢" },
    { id: 2, title: "今日特价" },
    { id: 3, title: "热卖推荐" },
    { id: 4, title: "橙心优选" }
]
export default class Goods extends Component {
    constructor() {
        super()
        this.state = {
            n: 0
        }
    }
    changeN(index) {
        this.setState({
            n: index
        })
    }
    render() {
        let { indexgoods } = this.props;
        return (
            <div className="indexgoods">

                <nav>
                    {
                        nav.map((item, index) => {
                            return <span key={item.id} onClick={() => this.changeN(index)} className={index === this.state.n ? "active" : ""}>{item.title}</span>
                        })
                    }

                </nav>
                    {
                        indexgoods[0].content.map(item => {
                            return <div key={item.id}>{item.goodsname}</div>
                        })
                    }

            </div>
        )
    }
}

